<template>
    <view class="cywj-con">
        <view class="main-pd">
            <view class="u-card">
                <view class="font-28 color-595959">标题：</view>
                <view class="font-32 color-333 u-m-t-16">
                    {{ wjMsg.title || '' }}
                </view>
            </view>
            <view class="u-card u-m-t-20" v-if="(wjMsg.dy).trim()">
                <view class="font-28 color-595959">问卷导语：</view>
                <view class="font-32 color-333 u-m-t-16">
                    {{ wjMsg.dy || '' }}
                </view>
            </view>
            <view class="u-card u-m-t-20">
                <view class="cywj-item" v-for="(item, index) in wjMsg.questionS" :key="item.questionInfo">
                    <view class="font-32 color-333 u-m-t-20">
                        {{ index + 1 }}、{{ item.questionInfo || '' }}
                    </view>
                    <view class="u-m-t-20" v-if="item.dxDx == 1">
                        <u-radio-group :disabled="wjMsg.isAnswer==1" v-model="item.selectOption" placement="row">
                            <u-radio activeColor="#f34b47" :customStyle="{ marginRight: '48rpx' }"
                                v-for="(item2, index2) in item.optionS" :key="item2.optionId"
                                :label="item2.optionSign + item2.optionInfo" :name="item2.optionId">
                            </u-radio>
                        </u-radio-group>
                    </view>
                    <view class="u-m-t-20" v-else-if="item.dxDx == 2">
                        <u-checkbox-group :disabled="wjMsg.isAnswer==1" v-model="item.selectOption" placement="row">
                            <u-checkbox activeColor="#f34b47" :customStyle="{ marginRight: '48rpx' }" v-for="(item3, index3) in item.optionS"
                                :key="item3.optionId" :label="item3.optionSign + item3.optionInfo" :name="item3.optionId">
                            </u-checkbox>
                        </u-checkbox-group>
                    </view>
                </view>
            </view>
            <view class="u-m-t-84" v-if="wjMsg.isAnswer==0">
                <u-button text="提交" shape="circle" color="linear-gradient(90deg, #FA827D 0%, #F34B47 100%)" :customStyle="{
                    fontSize: '36rpx',
                    height: '96rpx',
                }" @click="cywj"></u-button>
            </view>
        </view>
    </view>
</template>

<script setup>
import { getwjInfoApi, addwjApi } from "@/api/index"
import { onLoad } from "@dcloudio/uni-app"
import { ref } from "vue"
import useInfoStore from "@/store/user";
const userStore = useInfoStore();
let wjMsg = ref({
    isAnswer:0
})
let wjId = ref('')
// 获取详情
const getwjInfo = (id) => {
    getwjInfoApi({
        questionnaireId: id,
        dzyzkId:userStore.dzyzkId
    }).then(res => {
        if (res.success) {
            let data = res.data;
            data.questionS.forEach(item => {
                // 单选
                if(item.dxDx==1){
                    let result = item.optionS.find(option=>option.isSelect==1)
                   if(result){
                       item.selectOption = result.optionId
                   }else{
                       item.selectOption = ''
                   }
                }
                // 多选
                else if(item.dxDx==2){
                    item.selectOption = []
                    item.optionS.forEach(option=>{
                        if(option.isSelect==1){
                            item.selectOption.push(option.optionId) 
                        }else{
                            return
                        }
                    })
                }
            })
            wjMsg.value = data
        }
    })
}
// 参与问卷
const cywj = () => {
    let wjResult = []
    wjMsg.value.questionS.forEach(item => {
        if (item.selectOption == "") {
            uni.$u.toast("请选择完整！")
            throw new Error("请选择完整")
        }
        if(uni.$u.test.array(item.selectOption)){
            item.selectOption.forEach(option=>{
                  wjResult.push({
                    optionId:option,
                    questionId: item.questionId
                })
            })
        }else{
            wjResult.push({
                optionId: item.selectOption,
                questionId: item.questionId
            })
        }
    })
    addwjApi({
        answerOptions: wjResult,
        dzyzkId: userStore.dzyzkId,
        openId: userStore.openId,
        deptId: userStore.deptId,
        questionnaireId: wjId.value
    }).then(res => {
        if (res.success) {
            uni.$u.toast("参与成功！");
            return false;
        } else {
            uni.$u.toast(res.msg)
        }
    })
}
onLoad((param) => {
    wjId.value = param.id
    getwjInfo(param.id)
})
</script>

<style lang="scss" scoped>
.cywj-con {
    padding-top: 28rpx;
    padding-bottom: 80rpx;

    .cywj-item {
        border-bottom: 1rpx solid #e6e6e6;
        padding: 28rpx 0;

        &:first-child {
            padding-top: 0;
        }

        &:last-child {
            border: none;
            padding-bottom: 0;
        }
    }
}
</style>
